<template>
    <div class="app-container">
    注册用户
    <el-form label-width="120px">
        <el-form-item label="姓名">
            <el-input v-model="student.username"/>
        </el-form-item>

        <el-form-item label="昵称">
            <el-input v-model="student.nickname"/>
        </el-form-item>

        <el-form-item label="性别">
            <el-input v-model="student.sex"/>
        </el-form-item>

        <el-form-item label="邮箱">
            <el-input v-model="student.email"/>
        </el-form-item>

        <el-form-item label="手机号">
            <el-input v-model="student.phone"/>
        </el-form-item>

        <el-form-item label="密码">
            <el-input v-model="student.password"/>
        </el-form-item>

        <el-form-item>
            <el-button type="primary" @click="register">注册</el-button>
        </el-form-item>

        </el-form>
    </div>
</template>

<script>
import student from '@/api/student' 

export default {
    data() {
        return {
            student:{},
            

        }
    },
    created(){
        
    },
    methods:{
        //注册
        register(){
            student.register(this.student).then(response=>{
                // if(response.code===2000){
                    //提示
                    this.$message({
                        type:'success',
                        message:'注册成功'
                })
                console.log(response)
                //跳转列表页面 使用路由跳转方式实现
                this.$router.push({path:'/login'})

                // }
                //下边这个else中写的提示是不会显示的，主要原因是在request.js中的响应拦截器，它规定如果response.code!==20000,那么就会弹出错误信息
                //信息内容是response.message,所以后端的Result.fail方法要写上具体的message错误信息，而响应拦截器没有规定response.code===20000的情况
                //因为20000被放行了，这里是代码执行顺序问题，先走拦截器，如果是20001，就拦截掉，弹出错误信息，根本就不会走到这个else里，如果是20000，
                //就肯定能走到这个register函数，所以上边也不用判断if(response.code===2000)，因为响应拦截器已经帮我们过滤掉失败的响应，只有成功的
                //才能执行到这里的代码
                // else{
                //     if(response.code!==20000){
                //     //提示
                //     this.$message({
                //         type:'warning',
                //         message:'用户名已存在'
                // })
                // console.log(response)
                
                // }
                // }

                
                
                
                
            }) 
        },

       
        
    }
}
</script>

<style>

</style>